<!-- files.html -->
<!DOCTYPE html>
<html lang="en">

<!--head-->
<head>
    <meta charset="UTF-8">
    <title>{% block title %}亿云EIP内部文档{% endblock %}</title>
    <!-- bootstrap 3.3.7 -->
    <!-- 最新版本的 Bootstrap 核心 CSS 文件 -->
    <link rel="stylesheet" type="text/css" href="/static/css/bootstrap.min.css">
    <!-- 可选的 Bootstrap 主题文件（一般不用引入） -->
    <link rel="stylesheet" type="text/css" href="/static/css/bootstrap-theme.min.css">

    <!-- JQuery 2.1.14 -->
    <script type="text/javascript" src="/static/js/jquery-2.1.4.min.js"></script>
    <!-- 最新的 Bootstrap 3.3.7 核心 JavaScript 文件 -->
    <script type="text/javascript" src="/static/js/bootstrap.min.js"></script>
    <style>
        h1, h2, h3, h4, h5, p, div, a, table, form, nav, ul {
            font-family:微软雅黑;
        }
    </style>
</head>

<!--body-->
<body background="/static/img/global_bg.jpg" style="padding: 60px 10px 10px 10px;">
{% load staticfiles %}
{% include "files/files_header.html" %}
<div class="container-fluid">
    <div class="row">
         <div class="col-sm-7 col-md-7">
            <div class="panel panel-default">
                <div class="panel-heading">
                    <h4 class="panel-title"><strong>文档列表</strong></h4>
                </div>
                <!-- 统一在此显示通知信息 -->
                {% for message in messages %}
                    {% if forloop.last %}
                        <div class="alert alert-{{ message.tags }}">{{ message }}</div>
                    {% endif %}
                {% endfor %}

                <div class="panel-body">
                    <button class="btn btn-primary" data-toggle="modal" data-target="#UploadFileModal">上传文件</button>
                    <div class="modal fade" id="UploadFileModal" tabindex="-1" role="dialog" aria-labelledby="UploadFileLabel" aria-hidden="true">
                        <div class="modal-dialog" role="document">
                            <div class="modal-content">
                            </div>
                        </div>
                    </div>

                    <script>
                        $(function () {
                            $("#UploadFileModal").modal({
                                    keyboard: false,
                                    show: false,
                                    remote: "/files/upload_file"
                                })
                        });
                    </script>

                    <hr style="height:3px;border:none;border-top:3px double black;" />
                    <table class="table table-hover table-condensed table-bordered">
                    <thead>
                        <tr>
                            <td bgcolor="#C9C9C9"><strong>文档名称</strong></td>
                            <td bgcolor="#C9C9C9"><strong>上传时间</strong></td>
                        </tr>
                    </thead>
                    <tbody>
                    {% for k, v in fs.items %}
                        <tr class="success">
                            <td><a href="/media/{{ k }}" download="{{ k }}">{{ k }}</a></td>
                            <td>{{ v }}</td>
                        </tr>
                    {% endfor %}
                    </tbody>
                    </table>
                </div>
            </div>
        </div>

        <div class="col-sm-5 col-md-5">
            <div class="panel panel-default">
                <div class="panel-heading">
                    <h4 class="panel-title"><strong>日志记录</strong></h4>
                </div>
                <div class="panel-body">
                    <h4>当前服务器时间:  {{ now }}</h4>
                    <hr style="height:3px;border:none;border-top:3px double black;" />

                    {% for log in logs %}
                    <p><span style="color: orangered;"><strong>{{ log.current_date }}</strong></span> : <span style="color: dodgerblue;"><strong>{{ log.username }}</strong></span> <span>{{ log.content }}</span></p>
                    {% endfor %}
                </div>
            </div>
        </div>
    </div>
</div>
{% include "footer.html" %}
</body>
</html>